<template>
  <div class="pagination">
    <el-pagination
      @current-change="handleCurrentChange"
      :current-page.sync="currentPage"
      :page-size="pageNum"
      layout="total, prev, pager, next,jumper"
      :total="totalNum"
    >
    </el-pagination>
  </div>
</template>

<script>
export default {
  name: "pagination",
  data() {
    return {
      currentPage: 1,
      pageNum: 6,
      totalNum: 0,
    };
  },
  created() {},
  mounted() {
    //内容改变 回到第一页 current更改为1
    this.$bus.$on("searchChange", (_) => {
      this.currentPage = 1;
    });

    //获取总数
    this.$bus.$on("getTotalNum", (totalNum) => {
      this.totalNum = totalNum;
    });
  },
  methods: {
    handleCurrentChange(currentPage) {
      this.currentPage = currentPage;
      this.$bus.$emit("currentPageChange", this.currentPage);
    },
  },
};
</script>

<style  scoped>
.pagination {
  margin: 20px;
  text-align: center;
}
</style>
